<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>edoPostReply</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">


    <!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
    <link rel="stylesheet" href="../node_modules/bootstrap/dist/css/bootstrap.min.css" >

    <link rel="stylesheet" href="../node_modules/summernote/dist/summernote.css">

    <!-- 可选的 Bootstrap 主题文件（一般不用引入） -->
    <!--<link rel="stylesheet" href="./node_modules/bootstrap/dist/css/bootstrap-theme.min.css" >-->

    <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->

    <script src="../node_modules/jquery/dist/jquery.js" ></script>

    <script src="../node_modules/bootstrap/dist/js/bootstrap.js" ></script>

    <script src="../node_modules/summernote/dist/summernote.js"></script>
    <script src="../node_modules/summernote/dist/lang/summernote-zh-CN.js"></script>
    <script src="../node_modules/vue/dist/vue.js"></script>

    <script src="../node_modules/jquery-form/dist/jquery.form.min.js" ></script>
    <script type="text/javascript" src="/jquery.ajax.extend.js"></script>
</head>
<body>



<div class="container-fluid" style="margin: 5px 5px;"  id="edoPostReplyApp">


    <div class="panel panel-default">


        <div class="panel-body">

            <form class="form-horizontal"  role="form">

                <div class="form-group col-sm-6" v-show="false">
                    <label for="" class="col-sm-4 control-label">sid</label>
                    <div class="col-sm-8">

                        <input type="text" class="form-control" readonly v-model="edoPostDataForm.sid">

                    </div>
                </div>

                <div class="form-group col-sm-6">
                    <label for="" class="col-sm-4 control-label">标题</label>
                    <div class="col-sm-8">

                        <input type="text" class="form-control" readonly v-model="edoPostDataForm.sname">

                    </div>
                </div>


                <div class="form-group col-sm-6">
                    <label for="" class="col-sm-4 control-label">tags</label>
                    <div class="col-sm-8">

                        <input type="text" class="form-control" readonly v-model="edoPostDataForm.tags">
                    </div>
                </div>

                <div class="form-group col-sm-12">
                    <label for="" class="col-sm-2 control-label">内容</label>
                    <div class="col-sm-10">
                        <div class="summernote" id="postTxt"> {{edoPostDataForm.txt}}</div>
                    </div>
                </div>

            </form>

        </div>
    </div>



    <template v-for="item in edoReplyList">
        <div class="panel panel-info">
            <div class="panel-heading">
                <h3 class="panel-title">{{item.ctime}}  <span class="badge">{{item.userName}}</span></h3>
            </div>
            <div class="panel-body">
                <div class="summernote">{{item.txt}}</div>
            </div>
        </div>

    </template>


        <div class="modal-footer">
            <button type="button" class="btn btn-default" @click="edoPostReplyGridModal">返回</button>
            <button type="button" class="btn btn-primary" @click="edoPostReplyAddOrUpdate">提交</button>
        </div>

        <div class="panel-group" id="accordion">
            <div class="panel panel-default">
                <div class="panel-heading">
                    <h4 class="panel-title">
                        <a data-toggle="collapse" data-parent="#accordion"
                           href="#edoPostReplycollapse1">
                            基本信息
                        </a>
                    </h4>
                </div>
                <div id="edoPostReplycollapse1" class="panel-collapse collapse in">
                    <div class="panel-body">

                        <form class="form-horizontal"  role="form">

                            <div class="form-group col-sm-6">
                                <label for="" class="col-sm-3 control-label">sid</label>
                                <div class="col-sm-9">

                                    <input type="text" class="form-control" readonly v-model="edoPostReplyDataForm.sid">

                                </div>
                            </div>

                            <div class="form-group col-sm-6">
                                <label for="" class="col-sm-3 control-label">ctime</label>
                                <div class="col-sm-9">

                                    <input type="text" class="form-control" v-model="edoPostReplyDataForm.ctime">

                                </div>
                            </div>

                            <div class="form-group col-sm-6">
                                <label for="" class="col-sm-3 control-label">txt</label>
                                <div class="col-sm-9">

                                    <input type="text" class="form-control" v-model="edoPostReplyDataForm.txt">

                                </div>
                            </div>

                            <div class="form-group col-sm-6">
                                <label for="" class="col-sm-3 control-label">userName</label>
                                <div class="col-sm-9">

                                    <input type="text" class="form-control" v-model="edoPostReplyDataForm.userName">

                                </div>
                            </div>

                            <div class="form-group col-sm-6">
                                <label for="" class="col-sm-3 control-label">userPhone</label>
                                <div class="col-sm-9">

                                    <input type="text" class="form-control" v-model="edoPostReplyDataForm.userPhone">

                                </div>
                            </div>

                            <div class="form-group col-sm-6">
                                <label for="" class="col-sm-3 control-label">postId</label>
                                <div class="col-sm-9">

                                    <input type="text" class="form-control" v-model="edoPostReplyDataForm.postId">

                                </div>
                            </div>



                        </form>
                    </div>
                </div>
            </div>
            <div class="panel panel-default">
                <div class="panel-heading">
                    <h4 class="panel-title">
                        <a data-toggle="collapse" data-parent="#accordion"
                           href="#edoPostReplycollapse2">
                            其他
                        </a>
                    </h4>
                </div>
                <div id="edoPostReplycollapse2" class="panel-collapse collapse">
                    <div class="panel-body">

                        do sth
                    </div>
                </div>
            </div>
        </div>





    <!--tip start-->

    <!-- 模态框（Modal） -->
    <div class="modal fade" id="modal-container-edoPostReply" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-sm">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                    <h4 class="modal-title" id="myModalLabel">提示</h4>
                </div>
                <div class="modal-body"><p>{{tipMsg}}</p></div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                    <button type="button" class="btn btn-primary" v-show="confirmFlag" @click="edoPostReplyDelete">确定</button>
                </div>
            </div><!-- /.modal-content -->
        </div><!-- /.modal-dialog -->
    </div>
    <!-- /.modal -->

    <!--tip ends-->






</div>
</body>
</html>


<script>

    var vm = new Vue({
        el: '#edoPostReplyApp',
        components:{
            'red-star': {template: '<span ><i style="color: red;">*</i> <slot></slot></span>'}
        },
        data: {
            edoPostReplyDataForm: {},
            edoPostDataForm: {},
            edoReplyList:[],
            perPage:10,
            pageNow:1,
            totalPages:5,
            pageNumList:[],
            totalRows:0,
            checkedRows:[],
            checked:false,
            updateFlag:false,
            showFlag:'edoPostReply-grid',
            tipMsg: '',
            confirmFlag:false,
            deleteIds:[],



        },
        methods: {

            _getUrlKey: function (key) {
                return decodeURIComponent((new RegExp('[?|&]' + key + '=' + '([^&;]+?)(&|#|;|$)').exec(location.href) || [, ""])[1].replace(/\+/g, '%20')) || null
            },



            serializ:function () {

                var arr = [];
                var edoPostReplySearchForm = this.edoPostReplySearchForm;
                for(var k in edoPostReplySearchForm){
                    arr.push([k,'=',edoPostReplySearchForm[k]].join(''));
                }
                return arr.join("&");
            },


            edoPostReplyImport:function () {

                var _self = this;

                var file = $("#edoPostReplyFile").val();
                if (file == "") {
//                    alert("请选择要上传的文件");
                    $('#modal-container-edoPostReplyImport').modal('hide');
                    _self.popTipModal('请选择要上传的文件！');
                    return false
                }

                $("#edoPostReplyImportForm").ajaxSubmit({

                    type:"post",
                    url:'/edoPostReply/import',
                    success:function (data) {
//                        console.log(data);
                        if(data.code == '0'){

                            $('#modal-container-edoPostReplyImport').modal('hide');
                            _self.popTipModal('上传成功！');
                            _self.doSearch();

                        }else{
                            $('#modal-container-edoPostReplyImport').modal('hide');
                            _self.popTipModal(data.msg);
                        }
                    }
                });
                return false;
            },

            edoPostReplyExport:function () {

                window.open('/edoPostReply/export?'+this.serializ())
            },


            //提示框 弹框
            popTipModal:function (msg,confirmFlag) {

                this.tipMsg = msg;
                if(!!confirmFlag){
                    this.confirmFlag = true;
                }else{
                    this.confirmFlag = false;
                }

                $('#modal-container-edoPostReply').modal('show');
            },


            //返回 主页面
            edoPostReplyGridModal:function () {

                this.showFlag = 'edoPostReply-grid';
            },

            //新增弹框
            edoPostReplyAddModal:function () {

                this.edoPostReplyDataForm = { };
                this.showFlag = 'edoPostReply-add';
                this.updateFlag = false;
            },

            //修改弹框
            edoPostReplyUpdateModal:function (item) {

                var _self = this;
                var _sid = item.sid?item.sid:item.id;
                $.ajax({
                    url:'/edoPostReply/get/' + _sid,
//                    data: _self.edoPostReplySearchForm,

                }).done(
                    function (dat) {
                        if (dat.code == 0) {
                            var data = dat.data;
                            _self.edoPostReplyDataForm = data;
                            _self.showFlag = 'edoPostReply-update';
                            _self.updateFlag = true;
                        }
                    }
                );
            },

            //删除一个 弹框
            edoPostReplyDeleteOneModal:function (item) {

                var _sid = item.sid?item.sid:item.id;
                this.deleteIds = [_sid];
                this.popTipModal('确定要删除选中的数据吗？',true);
            },

            //删除多个 弹框
            edoPostReplyDeleteBatchModal:function () {

                var len = this.checkedRows.length;
                if(len<=0){
                    this.popTipModal('请选择要删除的数据');
                    return false;
                }

                this.deleteIds = [];
                for(var i=0;i<len;i++){
                    var indx = this.checkedRows[i];
                    var item = this.edoPostReplyList[indx];
                    var _sid = item.sid?item.sid:item.id;
                    this.deleteIds.push(_sid);
                }
                this.popTipModal('确定要删除选中的数据吗？',true);
            },


            //删除 提交
            edoPostReplyDelete:function () {

                var _self = this;

                $.ajax({
                    url:'/edoPostReply/delete?ids='+_self.deleteIds,
                    type: "POST",
                    datType: "JSON",
                }).done(
                    function (dat) {
                        if (dat.code == 0) {
                            _self.popTipModal('操作成功！');
                            _self.switchToPage(1);

                        }else{
                            _self.popTipModal(dat.msg);
                        }
                    }
                );

            },

            fnChangeAll: function () {

                var length = this.checkedRows.length;
                if(length>0){
                    this.checkedRows = [];
                }else{
                    var size=this.edoPostReplyList.length;
                    for(var i=0;i<size;i++){
                        this.checkedRows.push(i);
                    }
                }

            },

            fnChangeStatus:function (indx) {

                var number = this.checkedRows.indexOf(indx);
                if(number> -1){
                    this.checkedRows.splice(number, 1);
                }else{
                    this.checkedRows.push(indx);
                }
            },
            doSearch:function () {
                this.switchToPage(1);
            },
            doClear:function () {
                this.edoPostReplySearchForm={};
                this.switchToPage(1);
            },


            // 新增,修改 提交
            edoPostReplyAddOrUpdate:function () {

                var _self = this;
                var postUrl = "/edoPostReply/add";
                var _sid = this.edoPostReplyDataForm.sid?this.edoPostReplyDataForm.sid:this.edoPostReplyDataForm.id;
                if(_sid ){
                    postUrl = "/edoPostReply/update";
                }

                //
                $.ajax({
                    url:postUrl,
                    data: JSON.stringify(_self.edoPostReplyDataForm),
                    type: "POST",
                    datType: "JSON",
                    contentType: "application/json"

                }).done(
                    function (dat) {
                        if (dat.code == 0) {
                            _self.popTipModal('操作成功！');

                            if(dat.data.sid){
                                _self.edoPostReplyDataForm.sid=dat.data.sid;
                            }
                            if(dat.data.id){
                                _self.edoPostReplyDataForm.id=dat.data.id;
                            }
                            _self.switchToPage(1);

                        }else{
                            _self.popTipModal(dat.msg);
                        }
                    }
                );

            },

            switchToPage:function (pageNum) {

                if( pageNum >= this.totalPages){
                    pageNum = this.totalPages;
                }
                if(pageNum <= 0 ){
                    pageNum = 1;
                }

                this.pageNow = pageNum;
                this.getDataList(pageNum);

            },

            goBack:function () {
                var nowMinPage = this.pageNumList[0];
                if(!nowMinPage || nowMinPage <= 1){
                    return ;
                }
                var start = nowMinPage-1-10;

                this.pageNumList = [];
                for(var i= start+1;i <= nowMinPage-1;i++){

                    this.pageNumList.push(i);
                }

                var page = this.pageNumList[this.pageNumList.length -1];
                this.pageNow = page;

                var _self = this;
                this.ajaxQuery(page,_self);

            },
            goNext:function () {
                var nowMaxPage = this.pageNumList[this.pageNumList.length -1];
                if(!nowMaxPage || nowMaxPage >= this.totalPages){
                    return ;
                }
                var end = nowMaxPage+10;
                if(end > this.totalPages){
                    end = this.totalPages;
                }

                this.pageNumList = [];
                for(var i= nowMaxPage+1;i <= end;i++){
                    this.pageNumList.push(i);
                }

                var page = nowMaxPage+1;
                this.pageNow = page;

                var _self = this;
                this.ajaxQuery(page,_self);

            },

            //查询
            getDataList: function (page) {

                var _self = this;
                this.ajaxQuery(page,_self);

            },
            ajaxQuery:function (page, _self) {

                _self.checkedRows=[];
                $.ajax({
                    url:'/edoPostReply/pageInfo?current='+page +'&size='+10,
                    data: _self.edoPostReplySearchForm,

                }).done(
                    function (dat) {
                        if (dat.code == 0) {
                            var data = dat.data;
                            var dataList=data.records;
                            _self.edoPostReplyList=[];
                            for(var i in dataList){
                                _self.edoPostReplyList.push(dataList[i]);
                            }
                            _self.totalRows = data.total;
                            _self.totalPages= Math.ceil(data.total/data.size);

                            //前10页,
                            if(page <= 10){

                                _self.pageNumList = [];
                                var maxNavNum = _self.totalPages>10?10:_self.totalPages;
                                for(var i=0;i<maxNavNum;i++){
                                    _self.pageNumList.push(i+1);
                                }
                            }

                        }
                    }
                );
            }
        },
        mounted: function () {

            $('.summernote').summernote({
                lang: 'zh-CN',
                height: 300,

                toolbar:[

                ],
            });




//            this.switchToPage(1);
            var _self = this;
            var postId = this._getUrlKey("postId");

            if(postId){


                $.ajax({
                    url:'/edoPost/get/' + postId,

                }).done(
                    function (dat) {
                        if (dat.code == 0) {
                            var data = dat.data;
                            _self.edoPostDataForm = data;
                            $('#postTxt').summernote('code' , _self.edoPostDataForm.txt) ;
                        }
                    }
                );


                $.ajax({
                    url:'/edoPostReply/all?postId=' + postId,
//                    data: _self.edoPostSearchForm,

                }).done(
                    function (dat) {
                        if (dat.code == 0) {
                            var data = dat.data;
                            _self.edoReplyList = data;
                            _self.showFlag = 'edoPost-reply';
                        }
                    }
                );


            }
        }
    });

</script>